<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

	<div class="wrap_lnb_search">
		<div class="lnb_group_button">
	    	<table class="">
	    		<tr>
	    			<td><a id="btn_lnb_name" href="#" class="easyui-linkbutton btn_lnb" data-options="toggle:true,group:'g1',plain:true,selected:true">명칭</a></td>
	    			<td><a id="btn_lnb_content" href="#" class="easyui-linkbutton btn_lnb" data-options="toggle:true,group:'g1',plain:true">내용</a></td>
	    			<td><a id="btn_lnb_code" href="#" class="easyui-linkbutton btn_lnb" data-options="toggle:true,group:'g1',plain:true">코드</a></td>
	    			<td><a id="btn_lnb_index" href="#" class="easyui-linkbutton btn_lnb" data-options="toggle:true,group:'g1',plain:true">색인</a></td>
	    		</tr>
	    	</table>
	    </div>
		<div class="lnb_search" id="dic_search">    
		    <table class="">    
		    	<colgroup>
		    		<col width="60px">
		    		<col width="*">
		    	</colgroup>
		    	<tr>
		    		<td>
				    	<select>
				    		<option>질병</option>
				    		<option>직업</option>
				    	</select>
		    		</td>
		    		<td class="formSearch">
		    			<input type="text">
		    			<a class="btn_search"></a>
		    		</td>
		    	</tr>
		    </table>
	    </div>
	    <div id="dic_index" style="display:none">
			<div class="lnb_search middle">
		    	<select>
		    		<option>질병</option>
		    		<option>직업</option>
		    	</select>
		    </div>
		    <div class="lnb_group_button index">
		    	<table class="">
		    		<tr>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㄱ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㄴ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㄷ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㄹ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅁ</a></td>
		    		</tr>
		    		<tr>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅂ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅅ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅇ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅈ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅊ</a></td>
		    		</tr>
		    		<tr>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅋ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅌ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅍ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">ㅎ</a></td>
		    			<td><a href="javascript:void(0)" class="easyui-linkbutton btn_lndex" data-options="toggle:true,group:'g2',plain:true">A-Z</a></td>
		    		</tr>
		    	</table>
		    </div>
	    </div>
	</div>
    
    <div class="lnb_list">
    	<ul>
    		<li title="갑상선암" onclick="addTab('갑상선암','/WEB-INF/jsp/dic/dic_disease.jsp')">갑상선암</li>
    		<li title="결막염" onclick="addTab('결막염','/WEB-INF/jsp/dic/dic_disease.jsp')">결막염</li>
    		<li title="고혈압" onclick="addTab('고혈압','/WEB-INF/jsp/dic/dic_disease.jsp')">고혈압</li>
    		<li title="골절" onclick="addTab('골절','/WEB-INF/jsp/dic/dic_disease.jsp')">골절</li>
    		<li title="관절염" onclick="addTab('관절염','/WEB-INF/jsp/dic/dic_disease.jsp')">관절염</li>
    		<li title="급성 신우신염" onclick="addTab('급성 신우신염','/WEB-INF/jsp/dic/dic_disease.jsp')">급성 신우신염</li>
    		<li title="급성 편도염" onclick="addTab('급성 편도염','/WEB-INF/jsp/dic/dic_disease.jsp')">급성 편도염</li>
    	</ul>
    </div>
<script type="text/javascript">
$(function(){
 	$('#btn_lnb_name').removeClass('btn_lnb');
	$(".lnb_group_button a.easyui-linkbutton").click(function(event){
		var current_link = $(this);
		$(this).removeClass('btn_lnb'); 
		$('.lnb_group_button a.easyui-linkbutton').not(current_link).addClass('btn_lnb'); 
	});
	
	var current_btn = $('#btn_lnb_index');
	$(current_btn).click(function(){
		$('.easyui-accordion').find('.lnb.search_02').removeClass('search_02').addClass('search_03'); 
		$('#dic_index').css('display','block');
		$('#dic_search').css('display','none');
	});
	$('.easyui-linkbutton.btn_lnb').not(current_btn).click(function(){
		$('.easyui-accordion').find('.lnb.search_03').removeClass('search_03').addClass('search_02'); 
		$('#dic_index').css('display','none');
		$('#dic_search').css('display','block');
	});
	
	$('.lnb_list > ul > li').tooltip({
	    position: 'right',
	    content: '<span>This is the tooltip message.</span>',
	    onShow: function(){
	        $(this).tooltip('tip').addClass('tip');
	    }
	});
	$('.lnb_list > ul > li').mouseover(function(){
		$(this).addClass('tree-node-hover'); 
	});
	$('.lnb_list > ul > li').mouseout(function(){
		$(this).removeClass('tree-node-hover'); 
	});
	$(".lnb_list > ul > li").click(function(event){
		var current_head = $(this);
		$(this).addClass('tree-node-selected'); 
		$('.lnb_list > ul > li').not(current_head).removeClass('tree-node-selected'); 
	});
});
</script>

<!--[if lte IE 6]>
<script type="text/javascript"> 
$(document).ready(function() {		
	var current_btn = $('#btn_lnb_index');
	$(current_btn).click(function(){
		$('.lnb_list').attr('id','lnb_list_index'); 
		var height = $('.lnb_list').height()-87;
		$('#lnb_list_index').css('height', height); 
	});
	$('.easyui-linkbutton.btn_lnb').not(current_btn).click(function(){
		$('.lnb_list').attr('id','').css('height', '100%');
	});
 });
</script>
<![endif]-->